<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<link rel="stylesheet" type="text/css" href="font_c2am3mt5e6e/iconfont.css"/>
	<link rel="stylesheet" type="text/css" href="CSS/add.css"/>
</head>
<body>
<div class="add-main">
<div class="wrap">
	<div class="add-list">
		<div class="add-img">
			<img src="picture/picture2.jpg">
		</div>
		<div class="add-right">
			<p><input type="text" style="width: 400px;height: 40px;margin-left: 50px; font-size: 20px;" class="title" placeholder="书名："></p>
			<p><input type="text" style="width: 400px;height: 40px;margin-left: 50px; font-size: 20px;" class="author" placeholder="作者："></p>
			<p><input type="text" style="width: 400px;height: 40px;margin-left: 50px; font-size: 20px;" class="date" placeholder="出版日期："></p>
			<p><input type="text" style="width: 400px;height: 40px;margin-left: 50px; font-size: 20px;" class="press" placeholder="出版社："></p>
			<select id="oper_select" style="width: 400px;height: 40px;margin-left: 50px; font-size: 20px;" >
				<option value="" >选择书籍的分类</option>
				<option value="1">文学</option>
				<option value="2">流行</option>
				<option value="3">文化</option>
				<option value="4">生活</option>
				<option value="5">经管</option>
			</select>

		</div>
		<div class="add-footer">
			<textarea rows="50" placeholder="图书简介：" class="abs"></textarea>
		</div>
		<div class="footer-button">
			<button type="button"  class="btn"><i class="iconfont">&#xe606;</i>添加</button>
		</div>
	</div>
</div>	
</div>
<script>
    const btn=document.querySelector('.btn')
    const input=document.querySelectorAll('input')
	const abs=document.querySelector('textarea')
    btn.onclick=function (){
		// 1.获取select下拉框
		var myselect = document.getElementById("oper_select")
		// 2.获取option索引
		var index = oper_select.selectedIndex
		//获取option的值
		var oper_value = myselect.options[index].value
		console.log(oper_value)

		const xhr = new XMLHttpRequest()
        xhr.open('POST', 'http://8.130.14.155:8080/user/add', true)
        xhr.setRequestHeader('Content-Type', 'application/json')
        const books = {
            title:input[0].value,
            author:input[1].value,
            date:input[2].value,
            press:input[3].value,
			abs :abs.value,
				cid:oper_value,
        }
        xhr.send(JSON.stringify(books))
		alert("添加成功")
		location.href="addBook.html"
    }
</script>
</body>
</html>